<template>
    <div>
        <el-table
          :data="tableData"
          :highlight-current-row="true"
          :max-height="1500"
          :size="size"
          v-loading="loading"
          :align="align"
          border >
            <el-table-column
                align="center"
                prop="orgNumber"
                label="商家编码">
            </el-table-column>
            <el-table-column
                align="center"
                prop="merchantName"
                label="商家名称">
            </el-table-column>
            <el-table-column
                align="center"
                prop="merchantTypeName"
                label="组织分类">
            </el-table-column>
        </el-table>
        <div class="t_r">
            <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="pageRequest.start"
            :page-sizes="[10, 15, 20]"
            :page-size="pageRequest.limit"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total">
            </el-pagination>
        </div>
    </div>
</template>

<script>
export default {
    name:"merchantTemplate",
    data(){
        return{
            size:"small",
            loading: false,
            align:"center",
            tableData:[],
            total:0,
            pageRequest:{
                start: 1,
                limit: 10
            },
        }
    },
    methods:{
        renderMerchantTable(res){
            this.loading = false;
            this.tableData = res.rows;
            this.total = res.total;
        },
        init(){
            this.loading = true;
            this.$emit("findMerchantPage",{"start":this.pageRequest.start,"limit":this.pageRequest.limit});
        },
        handleSizeChange(val){
            this.pageRequest.limit = val;
            this.pageRequest.start = 1;
            this.init();
        },
        handleCurrentChange(val){
            this.pageRequest.start = val;
            this.init();
        }
    },
    mounted(){
        this.init();
    }
}
</script>

<style scoped lang="scss">
  @import '../../../../assets/css/public.scss';
</style>
